<template>
	<MkBillPanel :bill="ctx.zhuBiao" ref='billPanelRef' printCode='jcpx'>
		<template #button>
			<MkButtonEdit @click="edit" :isEdit="isCanEdit" />
			<MkButtonSubmit @click="submit" :loading="ctx.loading" :isEdit="ctx.isEdit" />
			<MkButtonMore>
				<a-menu-item @click="cancel">作废</a-menu-item>
				<a-menu-item @click="billPanelRef.showCaoZuo">操作记录</a-menu-item>
			</MkButtonMore>
			<MkButtonMore title="打印" @click="print" icon="ele-Printer">
				<a-menu-item @click="print">打印</a-menu-item>
			</MkButtonMore>
		</template>
		<template #info>
			<MkForm :model="ctx.zhuBiao" ref="formRef" formId="InvShouGongRuKu" :col="4">
				<MkInput label="配血标本" v-model="ctx.zhuBiao.biaoBenHao" prop="biaoBenHao" :isEdit="ctx.isEdit" />
				<MkInput label="配型类型" v-model="ctx.zhuBiao.peiXingLeiXing" prop="peiXingLeiXing" :isEdit="ctx.isEdit" />
				<MkInput label="备注" v-model="ctx.zhuBiao.remark" prop="remark" :isEdit="ctx.isEdit" :col="2" />
			</MkForm>
		</template>
		<MkPanel title="配血明细">
			<MkXueYeScanInput @onEnter="getBarcode" placeholder="扫血袋条码" ref="scanRef" width="300px" v-if="ctx.isEdit" />
			<MkTable :data="ctx.mingXiTable">
				<MkColumnIndex />
				<MkColumnXueYe rowKey="xueYe" />
				<MkColumnInputSelect prop="peiXueFangFa" selectId="jiaocha_peiXueFangFa" label="配血方法"
					:options="['微柱凝集法', '凝胶法', '盐水法']" :isEdit="ctx.isEdit" />
				<MkColumnInputSelect prop="fuHePeiXueFangFa" selectId="jiaocha_fuHePeiXueFangFa" label="复核配血方法"
					:options="['微柱凝集法', '凝胶法', '盐水法']" :isEdit="ctx.isEdit" />
				<MkColumnInputEnum enumType="ZhuCiCe" prop="zhuCe" label="主侧" :isEdit="ctx.isEdit" />
				<MkColumnInputEnum enumType="ZhuCiCe" prop="ciCe" label="次侧" :isEdit="ctx.isEdit" />
				<MkColumnInputEnum enumType="PeiXueJieGuo" prop="peiXueJieGuo" label="配血结果" :isEdit="ctx.isEdit" />
				<MkColumnInputUser prop="peiXueRenId" label="配血者" :isEdit="ctx.isEdit" />
				<MkColumnInputUser prop="fuHeRenId" label="复核者" :isEdit="ctx.isEdit" />
				<MkColumnInputDate prop="peiXueRiQi" width="200px" label="配血时间" :isEdit="ctx.isEdit" />
				<MkColumnNumber prop="xueYe.jiaGe" label="价格" width="80px" />
				<MkColumn prop="xueYe.caiXueShiJian" label="采血时间" min-width="140px" />
				<el-table-column label="操作" width="120px" fixed="right" v-if="ctx.isEdit">
					<template #default="{ row }">
						<el-button icon="ele-Delete" size="small" text type="danger" @click="deleteBlood(row)">删除</el-button>
					</template>
				</el-table-column>
			</MkTable>
		</MkPanel>
	</MkBillPanel>
	<list ref="listRef" @load="loadEntity" />
</template>

<script setup lang="ts">
import list from './list.vue';
import { useTraJiaoChaPeiXue } from './index';
const { ctx, formRef, scanRef, listRef, billPanelRef, isCanEdit,
	edit, initProps, initEmits, newEntity, loadEntity, submit, cancel, deleteBlood, getBarcode, print
} = useTraJiaoChaPeiXue();

import { TraShenQingDanOutput } from '/@/api/tra/TraShenQing';
// props在vue文件声明后才能传到ts文件
const props = defineProps({
	shenQingDanInfo: {
		type: Object as PropType<TraShenQingDanOutput>,
		default: () => { },
	},
});
const date = ref()
date.value = new Date()
/**
 * 初始化props
 */
initProps(props)
/**
 * 初始化emit
 */
const emits = defineEmits(['danju-change', 'submitCallBack'])
initEmits(emits)
/**
 * 导出接口
 */
defineExpose({
	newEntity, loadEntity
})
</script>
